<!--注册页面-->
<template>
	<ul class="third_input">
		<li style="color: red; text-align: center;line-height: 20px">密码为英文和数字的组合，不能含有特殊字符</li>
		<li>
			<el-input class="telnum" :type="pwdType1" v-model="inputfirst" placeholder="输入密码(6-12位字符)..." @blur="validate(1)">
				<i class="el-input__icon iconfont" :class="[flag1 ? 'icon-yanjing1':'icon-yanjing-copy']" slot="suffix" @click="flag1 = !flag1,changeType1()"></i>
			</el-input>
		</li>
		<li>
			<el-input class="telnum" :type="pwdType2" v-model="inputsecond" placeholder="确认密码(6-12位字符)..." @blur="validate(2)">
				<i class="el-input__icon iconfont" :class="[flag2 ? 'icon-yanjing1':'icon-yanjing-copy']" slot="suffix" @click="flag2 = !flag2,changeType2()"></i>
			</el-input>
		</li>
		<li>
			<el-button class="next" @click="confirm" @keydown.enter.tab.stop.self="confirm">完成注册</el-button>
		</li>
	</ul>
</template>

<script>
	import {Register} from '@/until/getData';
	import Public from '@/until/public';
	export default {
		name: 'HelloWorld',
		data() {
			return {
				pwdType1:'password',
				pwdType2:'password',
				flag1: false,
				flag2: false,
				inputfirst: '',			// 第一次输入
				inputsecond: ''			// 第二次输入
			}
		},
		methods: {
			changeType1(){
                if (this.pwdType1 == "password") {
                    this.pwdType1 = "text";
                } else {
                    this.pwdType1 = "password";
                }
			},
			changeType2(){
                if (this.pwdType2 == "password") {
                    this.pwdType2 = "text";
                } else {
                    this.pwdType2 = "password"
                }
			},
			confirm:function(){
				if (this.inputfirst == this.inputsecond) {
					if (this.inputfirst.length >= 6 && this.inputfirst.length <= 12) {
						let info = Public.JS_Cookie('get', 'info');
						info['password'] = this.inputfirst;
						info['repassword'] = this.inputsecond;
						Register(info).then((res) => {
							if (res.code == '1') {
								this.$message({
									showClose: true,
									message: res.msg,
									type: 'success',
									center: true,
									duration: 1500
								});
								setTimeout(() => {
									Public.JS_Cookie('remove', 'info');
									this.$router.push({
										name: 'accountlogin'
									});
								}, 1500);
							} else if(res.code == '0'){
								this.$message({
									showClose: true,
									message: res.msg,
									type: 'error',
									center: true,
									duration: 2000
								});
								if (res.msg == '帐号名称已经存在！') {
									setTimeout(() => {
										this.$router.push({
											name: 'accountlogin'
										});
									}, 2000);
								}
							}
						}).catch((err) => {
							console.log(err);
						});
					} else {
						this.$message({
							showClose: true,
							message: '请输入6-12位密码',
							type: 'warning',
							center: true,
							duration: 2000
						});
					}
				} else {
					this.$message({
						showClose: true,
						message: '您输入的两次密码不一样',
						type: 'warning',
						center: true,
						duration: 2000
					});
				}
			},
			validate(val){
				if (val == '1') {
					if (this.inputfirst != '') {
						if (!Public.checkTextSpace(this.inputfirst)) {
							this.$message({
								message: '密码只能是数字和英文，请重新输入',
								type: 'warning',
								center: true,
								duration: 2000
							});
						}
					}
				} else if(val == '2'){
					if(this.inputsecond != ''){
						if (!Public.checkTextSpace(this.inputsecond)) {
							this.$message({
								message: '密码只能是数字和英文，请重新输入',
								type: 'warning',
								center: true,
								duration: 2000
							});
						}
					}
				}
			}
		}
	}
</script>
<style scoped>
	ul.third_input{
		width: 334px;
		padding-top: 24px;
		margin: 0 auto;
	}
	ul.third_input li{
		padding-top: 20px;
		list-style: none;
	}
	ul.third_input li .password{
		width: 185px;
	}
	ul.third_input li .next{
		width: 334px;
		height: 42px;
		background: linear-gradient(to right, #7557d1, #8b63e8);
		color: white;
		font-size: 14px;
	}
</style>